<template>
  <el-tabs tab-position="left" style="height: 1000px;padding: 20px">
    <el-tab-pane label="课程预约">
      <CourseReservation
        :queryParams="courseQueryParams"
        :showSearch="courseShowSearch"
        :courseList="courseList"
        :instructorList="instructorList"
        :reservationList="courseReservationList"
        :loading="courseLoading"
        :total="courseTotal"
        :dict="dict"
        style="padding: 30px"
      />
    </el-tab-pane>
    <el-tab-pane label="实验室预约">
      <LabBorrow
        :queryParams="labQueryParams"
        :showSearch="labShowSearch"
        :labList="labList"
        :instructorList="instructorList"
        :labBorrowList="labBorrowList"
        :loading="labLoading"
        :total="labTotal"
        style="padding: 30px"
      />
    </el-tab-pane>
    <el-tab-pane label="器材租用">
      <EquipmentBorrow
        :queryParams="equipQueryParams"
        :showSearch="equipShowSearch"
        :equipmentList="equipmentList"
        :instructorList="instructorList"
        :borrowList="borrowList"
        :loading="equipLoading"
        :total="equipTotal"
        style="padding: 30px"
      />
    </el-tab-pane>
  </el-tabs>
</template>

<script>
import CourseReservation from './CourseReservation/index.vue'
import LabBorrow from './LabBorrow/index.vue'
import EquipmentBorrow from './EquipmentBorrow/index.vue'

export default {
  components: {
    CourseReservation,
    LabBorrow,
    EquipmentBorrow
  },
  data() {
    return {
      courseQueryParams: {},
      courseShowSearch: true,
      courseList: [],
      instructorList: [],
      courseReservationList: [],
      courseLoading: false,
      courseTotal: 0,
      dict: {},

      labQueryParams: {},
      labShowSearch: true,
      labList: [],
      labBorrowList: [],
      labLoading: false,
      labTotal: 0,

      equipQueryParams: {},
      equipShowSearch: true,
      equipmentList: [],
      borrowList: [],
      equipLoading: false,
      equipTotal: 0
    };
  }
};
</script>
